<template>
	<view>
		<view class="mui-content" style="margin-top: 40rpx;">
			<view class="top3">
				<view class="mui-input-row">
					<input type="text" class="ren" placeholder="昵称 " v-model="nick">
				</view>
				<view class="mui-input-row">
					<input type="text" class="ren" placeholder="自己手机号 " v-model="phone">
				</view>
				<view class="mui-input-row">
					<input type="text" class="ren" placeholder="推荐人手机号" v-model="tjrPhone">
				</view>
				<view class="mui-input-row">
					<input type="password" class="ren1" placeholder="密码" v-model="loginPassword">
				</view>
				<view class="mui-input-row">
					<input type="password" class="ren1" placeholder="确认密码" style="border-top: hidden;border-bottom: hidden;" v-model="loginPassword1">
				</view>
				<view style="height: 60px;">
					<input type="text" placeholder="验证码" v-model="code"
						style="border: 0.5rpx #ecdede solid;padding-left: 5rpx;float:left;width:49%;text-indent: 25px;background-color: white;padding: 20rpx 0 25rpx 0;">
					<button class="getyzm" @click="getCode()" :disabled="disabled" style="background-color: white;color: #888888;">{{captchaText}}</button>
				</view>
			</view>
			<view class="input-box">
				<button class="loginBtn" @click="zhuce()" style="background-color: #FF7900;color: white;">注册</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nick:'',					//昵称
				phone:'',					//手机号
				tjrPhone:'',				//推荐人手机号
				loginPassword:'',			//密码
				loginPassword1:'',			//确认密码
				code:'',					//验证码
				disabled: false,			//倒计时过程中不能获取验证码
				captchaText: '获取验证码',
				openId:'',					//小程序openId
				avatarUrl:'',				//小程序用户头像
				nickName:'',				//小程序昵称
			}
		},
		onLoad() {
			this.getOpenId();
		},
		methods: {
			//注册新用户
			zhuce(){
				// console.log("昵称："+this.nick+" 手机号："+this.phone+" 推荐人手机号："+this.tjrPhone+" 密码："+this.loginPassword+" 确认密码："+this.loginPassword1+" 验证码："+this.code)
				if(this.isNull(this.nick)){
					this.$u.toast('请输入昵称!');
					return;
				}
				if(this.isNull(this.phone)){
					this.$u.toast('请输入手机号!');
					return;
				}
				var reg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
				if(!reg.test(this.phone)){
					this.$u.toast('请输入正确的手机号!');
					return;
				}
				if(this.isNull(this.tjrPhone)){
					uni.showModal({
						title:'推荐人设置',
						content:'是否使用默认推荐人?',
						cancelText:"不使用",
						confirmText:"使用",
						success:(res)=> {
							if(res.confirm){
								this.tjrPhone = "18773390513";
							}else if(res.cancel){
								this.$u.toast('请输入推荐人手机号!');
								return;
							}
						}
					})
					// this.$u.toast('请输入推荐人手机号!');
					// return;
				}
				var reg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
				if(!reg.test(this.tjrPhone)){
					uni.showModal({
						title:'推荐人设置',
						content:'是否使用默认推荐人?',
						cancelText:"不使用",
						confirmText:"使用",
						success:(res)=> {
							if(res.confirm){
								this.tjrPhone = "18773390513";
							}else if(res.cancel){
								this.$u.toast('请输入推荐人正确的手机号!');
								return;
							}
						}
					})
				}
				if(this.isNull(this.loginPassword)){
					this.$u.toast('请输入登录密码!');
					return;
				}
				if(this.isNull(this.loginPassword1)){
					this.$u.toast('请确认密码!');
					return;
				}
				if(this.loginPassword.length < 6){
					this.$u.toast('密码长度不能小于六位!');
					return;
				}
				if(this.loginPassword != this.loginPassword1){
					this.$u.toast('输入的两次密码不相同，请重新输入!');
					return;
				}
				if(this.isNull(this.code)){
					this.$u.toast('请输入验证码!');
					return;
				}
				this.$http.get('/weixin/registXcx', {
					nick:this.nick,
					password:this.loginPassword,
					phone:this.phone,
					yzcode:this.code,
					tjr:this.tjrPhone
				}).then(res => {
					if(res.data.code==200){
						this.$u.toast("注册成功")
						// console.log(res.data.data)
						//用户绑定小程序openId
						this.$http.get('/userinfo/userBdWeixinMini',{
							userid:res.data.data.usersId,
							openId:this.openId,
							icon:this.avatarUrl,
							nick:this.nickName,
							type:0
						}).then(res => {
							// console.log(res);
						})
						setTimeout(() => {
							uni.navigateTo({
								url:'login'
							})
						},500)
					}else{
						this.$u.toast(res.data.msg)
					}
				})
				//注册  赵荣 18684532537
			},
			//获取验证码
			getCode(){
				var reg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
				if (!reg.test(this.phone)) {
					this.$u.toast('抱歉，请输入正确的手机号!');
					return;
				}else{
					//获取用户信息
					uni.getUserProfile({
						desc: '获取你的昵称、头像、地区及性别',
						success: res => {
							// console.log(res);
							this.avatarUrl = res.userInfo.avatarUrl;
							this.nickName = res.userInfo.nickName;
						},
						fail: res => {
							//拒绝授权
							this.$u.toast("您拒绝了请求,不能正常使用小程序购买支付功能")
							return;
						}
					});
					this.$http.get('/sms/create',{
						phone:this.phone
					}).then(res => {
						if(res.data.code==404){
							this.$u.toast("手机号码不存在！");
							return
						}else if(res.data.code==500){
							this.$u.toast("该手机号已经被注册！");
							return
						}else{
							this.disabled = true;
							this.miao = 10;
							var that = this;
							const fn = setInterval(function() {
								that.captchaText = that.miao + 's后再次发送';
								that.miao = that.miao - 1;
								if (that.miao == 0) {
									that.disabled = false;
									that.captchaText = "获取验证码";
									clearInterval(fn);
								}
							}, 1000);
						}
					})
				}
			},
			//获取用户openId
			getOpenId(){
				uni.login({
					success: res => {
						// console.info('临时code：',res.code);//code值(5分钟失效)
						this.$http.get('/userinfo/getOpenid',{
							code:res.code
						}).then(res => {
							// console.log("用户openId："+res.data)
							uni.setStorageSync('openId',res.data)
							this.openId = res.data;
						})
					}
				})
			},
			//判断为空
			isNull(str){
				return str==null || str=="" || str==undefined
			}
		}
	}
</script>

<style>
	.top3 {
		width: 90%;
		margin-left: 5%;
	}
	.input-box{
		margin: 0rpx 20rpx;
		position: relative;
	}
	.input-box .icon{
		position: absolute;
		left: 10rpx;
		top: 20rpx;
		z-index: 100;
	}
	.input-box .input{
		background-color: white;
	}
	.loginBtn{
		width: 95%;
		margin-top: 60rpx;
		color: white;
		letter-spacing:10px;
	}
	.ren{
		border: 0.5rpx #ecdede solid;
		background-color: white;
		height: 50px;
		padding-left: 40px;
		background-image: url(../../static/center/login_name.png);
		background-size: 20px;
		background-repeat: no-repeat;
		background-position-x: 10px;
		background-position-y: 15px;
	}
	.ren1{
		border: 0.5rpx #ecdede solid;
		background-color: white;
		height: 50px;
		padding-left: 40px;
		background-image: url(../../static/center/login_password.png);
		background-size: 20px;
		background-repeat: no-repeat;
		background-position-x: 10px;
		background-position-y: 15px;
	}
</style>
